<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>博艺网-确认订单</title>
    <link rel="shortcut icon" type="image/x-icon" href="http://img.boyitongcheng.com/favicon.ico" media="screen" />
    <link href="/common/css/common.css" rel="stylesheet" type="text/css"/>
    <link href="/common/css/iconfont.css" rel="stylesheet" type="text/css"/>
    <link href="/common/css/tallyOrder.css" rel="stylesheet"/>
    <script type="text/javascript" src="/common/js/jquery-1.8.2.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/flatpickr/dist/flatpickr.min.css">
    <script src="https://unpkg.com/flatpickr"></script>
    <script src="https://npmcdn.com/flatpickr/dist/l10n/zh.js"></script>

    <link rel="stylesheet" href="/common/js/jquery-plugin/validate/style.css" type="text/css">
    <script type="text/javascript" src="/common/js/jquery-plugin/validate/jquery.validate.min.js"></script>
<#if user.getUserType() == 4>
    <script type="text/javascript" src="/common/js/payfor.js"></script>
</#if>
    <style>
        .redClass {
            background-color: #e11122 !important;
            color: #f1f1f1;
        }
        .greenClass {
            background-color: #38b44a !important;
            color: #f1f1f1;
        }
        .greyClass {
            background-color: darkgrey !important;
            color: #f1f1f1;
        }
        .orangeClass {
            background-color: orange !important;
        }

        /*.sub{border:solid 1px #ddd;padding:10px 0 0 10px;width:480px;height:80px;margin:40px auto;}*/
        .sub .f_l{float: left;}
        .sub .add_chose{width:105px;}
        .sub  .add_chose a.add{margin:3px 0 0 0;display:block;width:15px;height:15px;line-height:99em;overflow:hidden;background:url(/common/images/reduce-add.gif) no-repeat;}
        .sub  .add_chose a.reduce{margin:5px 0 0 0;display:block;width:15px;height:15px;line-height:99em;overflow:hidden;background:url(/common/images/reduce-add.gif) no-repeat;}
        .sub  .add_chose a.reduce{background-position:0 0;}
        .sub  .add_chose a.reduce:hover{background-position:0 -16px;}
        .sub  .add_chose a.add{background-position:-16px 0;}
        .sub .add_chose a.add:hover{background-position: -16px;}
        /*.sub .add_chose .text{float:left;margin:0 5px;display:inline;border:solid 1px #ccc;padding:4px 3px 4px 8px;width:40px;line-height:18px;font-size:14px;color:#990000;font-weight:800;}*/
        /*.sub .buy{line-height:2em;}*/
        /*.sub .buy .total-font{font-family:Arial;font-size:26px;}*/
        /*.sub .buy .jifen{margin-left:20px;color:#ACACAC;}*/
        /*.sub .buy .jifen b{margin:0 3px;}*/
    </style>
</head>

<body>

<#include "../header.ftl" />

<#include "../banner_other.ftl" />

<div class="sub_nav">
    <div class="main">
        <ul class="sub_navtop">

            <li><a href="/index">首页</a></li>
        <#if topList??>

            <#list topList as top>
                <li><a href="/list?channel_id=${top.getId()}&position_id=${top.getPositionId()}&style_type=0&price=0&area=0" target="_blank">${top.getName()}</a></li>
            </#list>

        </#if>

        </ul>
    </div>
</div>

<div class="tallyOrder">
    <div class="main">
        <h3>确认订单信息</h3>

        <form id="hq_form1" method="post">
            <input id="buy_type" name="buy_type" type="hidden" value="${buy_type?string}">
            <input id="biz_user_id" name="biz_user_id" type="hidden" value="${user.getId()?string}">
            <input id="product_id" name="product_id" type="hidden" value="${product.getId()?string}">

            <div class="sub">

                    <#if user.getUserType() == 4>
                        <div class="contact-p contact-msg" style="margin-top: 20px;height: 40px;">
                            <label style="float: left;">下单数量：</label>
                            <input type="text" name="qty_item_1" value="1" id="qty_item_1" onKeyUp="setAmount.modify('#qty_item_1')" style="float:left;margin:0 5px;display:inline;border:solid 1px #ccc;padding:4px 3px 4px 8px;width:30px;line-height:18px;font-size:14px;color:#990000;font-weight:800;"/>

                        <div class="f_l add_chose">
                            <a class="add" onClick="setAmount.add('#qty_item_1')" href="javascript:void(0)">+</a>
                            <a class="reduce" onClick="setAmount.reduce('#qty_item_1')" href="javascript:void(0)">-</a>
                        </div>
                        </div>
                    </#if>

                    <p class="contact-p contact-msg">
                        <label>执行日期：</label>
                        <input type="text" id="schedule_date" name="schedule_date" />
                    </p>
                    <p class="contact-p contact-msg">
                        <label>宴席时间：</label>
                        <select id="dinner_type" name="dinner_type" >

                        </select>
                    </p>
                    <p>
                        <label>给商家留言：</label>
                        <textarea name="descn" id="descn" placeholder="选填:请添加订单备注,包括执行场地、酒店等信息,方便商家接单"></textarea>
                    </p>
                    <p  class="contact-p contact-msg">
                        <label>&nbsp;</label>
                    </p>

                    <#if buy_type?? && buy_type == 1>
                       <p>
                           <label>选择付款方式：</label>
                           <input type="radio" id="r2" name="pay_status" checked=true/>&nbsp;支付全款&nbsp;&nbsp;
                           <input type="radio" id="r1" name="pay_status"/>&nbsp;预付定金 (定金款:￥${deposit?string("0.00")})
                       </p>
                   </#if>

            </div>
            <div class="sub-bottom">
                <p><span style="color: inherit;font-size: 18px;">订单金额:</span><span style="font-size: 18px;" id="total_item_1">￥${product.getCurrentPrice()?string("0.00")}</span><span>(商品单价：<strong id="price_item_1">￥${product.getCurrentPrice()?string("0.00")}</strong>)</span></p>

                <#if buy_type?? && buy_type == 1>
                    <button class="button_b" type="submit">去下单</button>
                <#else >
                    <button class="button_c" type="submit">加入购物车</button>
                </#if>


            </div>
        </form>
    </div>
</div>

<#include "../help_link.ftl"/>

<#include "../footer.ftl" />

<#include "../toolbar.ftl" />

</body>

<script>

    function get2DigitFmt(val) {
        return ('0' + val).slice(-2);
    }

    $(function () {

        $("#schedule_date").flatpickr({locale: "zh",minDate: "today",
            onDayCreate: function(dObj, dStr, fp, dayElem) {
            var date = dayElem.dateObj,
                    // Note the + 1 in the month.
                    key = date.getFullYear() + get2DigitFmt(date.getMonth() + 1) + get2DigitFmt(date.getDate()),
            <#if scheduleData??>
                    value = ${scheduleData}[key];
                if (value) {
                    dayElem.className += ' ' + value;
                    if (value == "greyClass"){
                        dayElem.className += ' disabled';
                    }
                }
            </#if>
            },
            onChange: function(selectedDates, dateStr, instance) {
                var userType = ${user.getUserType()?string};
                var selObj = $("#dinner_type");
                var selOpt = $("#dinner_type option");
                selOpt.remove();
                selObj.append("<option value='' selected></option>");

                if (userType == "3"){
                    key = dateStr.split("-").join('');
                    value = ${scheduleData}[key];

                    if (value == "lunchClass"){
                        selObj.append("<option value='晚宴'>晚宴</option>");
                    }else if (value == "dinnerClass"){
                        selObj.append("<option value='午宴'>午宴</option>");
                    }else{
                        selObj.append("<option value='午宴'>午宴</option>");
                        selObj.append("<option value='晚宴'>晚宴</option>");
                    }
                }else{
                    selObj.append("<option value='午宴'>午宴</option>");
                    selObj.append("<option value='晚宴'>晚宴</option>");
                }
            },
        });

        $("#hq_form1").validate({
            rules: {
                schedule_date: {
                    required: true
                },
                dinner_type: {
                    required: true
                }
            },
            messages: {
                schedule_date: {
                    required: "请选择执行日期"
                },
                dinner_type: {
                    required: "请选择宴席时间"
                }
            },
            errorPlacement: function (error, element) { //指定错误信息位置
//                    error.insertAfter(element);
//                    $(element).closest("div").addClass("has-error");
            },
            highlight: function (element) {
                $(element).closest("div").removeClass("has-success");
                $(element).closest("div").addClass("has-error");
            },
            unhighlight: function (element, errorClass) { // element通过验证时触发
                $(element).closest("div").removeClass("has-error");
                $(element).closest("div").addClass("has-success");
            },
            submitHandler: function (form) {
                var actionType = $("#buy_type").val();

                if($("#pay_status").checked || $(this).attr("checked")=="checked")

                var pay_status;
                if($("#r1").checked || $("#r1").attr("checked")=="checked")
                {
                    pay_status = 1;
                }

                if($("#r2").checked || $("#r2").attr("checked")=="checked")
                {
                    pay_status = 2;
                }

//                alert(actionType);
                if (actionType == "2"){
                    form.action = "/user/addTrolley?pay_status="+pay_status;
                }else{
                    form.action = "/order/addDirectBuy?pay_status="+pay_status;
                }
//                alert(form.action);
                form.submit();
            }
        });

    });

</script>

</html>
